<template>
  <div>
    <div v-if="dialogVisible">
      <el-dialog title="信息确认并提交" :visible.sync="dialogVisible" width="700px">
        <div>
          <div v-for="(item, i) in systemGuifanFilesProcessList" :key="i">
            <div>
              <b>管理信息<span v-if="systemGuifanFilesProcessList.length>1">({{index + 1}})</span></b>
            </div>
            <table class="table1 owntable mb20 tableLayout" border="0" cellspacing="0" cellpadding="1" width="100%">
              <tr>
                <td width="150">设计开发更改管理编号</td>
                <td>{{ item.number }}</td>
                <td width="150">设计开发计划管理编号</td>
                <td>{{ item.planNumber }}</td>
              </tr>
              <tr>
                <td>产品名称</td>
                <td>{{ item.name }}</td>
                <td>规格型号</td>
                <td>{{ item.skus }}</td>
              </tr>
              <tr>
                <td>产品代码</td>
                <td>{{ item.code }}</td>
                <td>更改阶段</td>
                <td>{{ item.changePhase == 0 ? '注册备案前更改' : '注册备案后更改' }}</td>
              </tr>
              <tr>
                <td>管理部门</td>
                <td>{{ item.manageDeptName }}</td>
                <td>负责人</td>
                <td>{{ item.manageUserName }}</td>
              </tr>
              <tr>
                <td>编制部门</td>
                <td>{{ item.createDeptName }}</td>
                <td>检验设备</td>
                <td>{{ item.isUser == 0 ? '无' : '有' }}</td>
              </tr>
            </table>
      
            <table class="table1 owntable mb20 tableLayout" border="0" cellspacing="0" cellpadding="1" width="100%" v-if="item.deviceList.length != 0">
              <tr>
                <td>设备名称</td>
                <td class="gray_bg">设备型号</td>
                <td>设备编号</td>
              </tr>
              <tr v-for="(v, i) in item.deviceList" :key="i">
                <td class="white_bg">{{ v.deviceName }}</td>
                <td class="white_bg">{{ v.deviceModel }}</td>
                <td class="white_bg">{{ v.deviceNumber }}</td>
              </tr>
            </table>
      
            <preview-file :detail="item"></preview-file>
          </div>
          <preview-process-record :guifanFilesProcessRecordList="guifanFilesProcessRecordList"></preview-process-record>
      
          <div class="pub_center"><el-button size="small" type="primary" @click.once="close()">提交</el-button></div>
        </div>
      </el-dialog>
    </div>
  </div>
</template>

<script>
export default {
  props: {
    type: String,
    guifanFilesProcessRecordList: [],
    systemGuifanFilesProcessList: []
  },
  data() {
    return {
      dialogVisible: false
    };
  },
  methods: {
    init() {
      this.dialogVisible = true;
    },
    close() {
      this.$emit('close');
    }
  }
};
</script>

<style scoped="scoped">
.table1 {
  margin-bottom: 20px;
}

table {
  width: 660px;
}
</style>
